<template>
  <div class="container">

    <div>
      <van-nav-bar title="招聘信息录入"
                   left-text=""
                   @click-left="onClickLeft"
      />
    </div>

    <div>

      <van-form @submit="onSubmit">

        <van-cell  title="请选择招聘职位" required title-class="titleclass"   v-model="positionName" center is-link @click="showZpzw" />


        <div>
          <van-field
            v-model="zprs"
            label="招聘人数："
            label-width="30%"
            required
            placeholder="请输入招聘人数"
          />
        </div>

        <div >
          <van-field
            v-model="zgxz"
            label="最高薪资："
            label-width="30%"
            required
            placeholder="请输入最高工资"
          />


        </div>

        <div >
          <van-field
            v-model="zdxz"
            label="最低薪资："
            label-width="30%"
            required
            placeholder="请输入最低工资"
          />
        </div>


        <div>
          <van-field
            v-model="lxdh"
            label="联系电话："
            label-width="30%"
            required
            placeholder="请输入联系电话"
          />
        </div>

        <van-divider />

        <div class="text1">
          职位介绍：
        </div>
        <div>
          <van-field
            v-model="zwjs"
            rows="4"
            autosize
            required
            label=""
            type="textarea"
            maxlength="200"
            placeholder="请输入职位介绍"
            show-word-limit
          />
        </div>

        <van-divider />

        <div class="text1">
          岗位要求：
        </div>
        <div>
          <van-field
            v-model="gwyq"
            rows="4"
            autosize
            required
            label=""
            type="textarea"
            maxlength="200"
            placeholder="请输入岗位要求"
            show-word-limit
          />
        </div>


        <div style="margin-top: 40px;margin-left: 16px;margin-right: 16px;padding-bottom: 50px;">
          <van-button round block type="info" native-type="submit">提交</van-button>
        </div>

      </van-form>


      <van-action-sheet v-model="show" :actions="zpzwOptions" @select="onSelectZpzw" />


    </div>
  </div>
</template>

<script>
  import {saveReport,saveReportReadNum ,uploadShareImg,saveDkinfo,queryDictData ,saveZpinfo ,getAgencyInfo} from 'api/api'
  import {Toast} from 'vant'
  export default {
    name: 'myquanzi',
    data() {
      return {
        zpzwOptions:[],
        show:false,
        positionName:'',
        position:'',
        zprs:'',
        zwjs:'',
        gwyq:'',
        zprs:'',
        lxdh:'',
        zgxz:'',
        zdxz:''


      }
    },
    created() {

      const agencyId = this.$route.query.agencyId
      this.agencyid = agencyId

      this.queryDictData()

      this.getAgencyInfo()


    },
    methods: {

      showZpzw(){
        this.show = true

      },

      onSelectZpzw(item){
        this.positionName = item.name
        this.position = item.id
        this.show = false
      },

      getAgencyInfo(){

        let param = {agencyid:this.agencyid}

        getAgencyInfo(param).then(response => {
          if (response.code === 200) {
            console.log(response)
            let agencyInfo = response.data

            this.lxdh = agencyInfo.cellnum
          }else{
            Toast.fail(response.msg)
          }
        })

      },

      queryDictData(){
        let param = {dictType:'zpzw'}

        queryDictData(param).then(response => {
          if (response.code === 200) {
            console.log(response)
            let list = response.data
            let options = []
            if(list){
              if(list.length > 0 ){
                for(var i=0;i<list.length;i++){
                  let obj = {name:list[i].dictLabel,id:list[i].dictValue}
                  options.push(obj)
                }
              }
            }
            this.zpzwOptions = options
          }else{
            Toast.fail(response.msg)
          }
        })

      },

      //识别操作系统
      viewczxt(){
        var u = navigator.userAgent, app = navigator.appVersion;
        var isXiaomi = u.indexOf('XiaoMi') > -1; // 小米手机
        var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; // 其它安卓
        var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios
        if (isAndroid) {
          return "Android"
        }else if (isIOS) {
          if(isXiaomi) {
            return  "Android"
          }else {
            return  "Ios"
          }
        }
      },

      onClickLeft() {
        this.$router.go(-1) // 返回上一层
      },

      onSubmit(){
        let param = {}
        param.agencyid = this.agencyid
        param.zprs = this.zprs
        param.zwjs = this.zwjs
        param.gwyq = this.gwyq
        param.lxdh = this.lxdh
        param.position = this.position
        param.zgxz = this.zgxz
        param.zdxz = this.zdxz


        if(!param.zprs){
          Toast.fail('请输入招聘人数')
          return
        }

        if(!param.zwjs){
          Toast.fail('请输入职位介绍')
          return
        }

        if(!param.gwyq){
          Toast.fail('请输入岗位要求')
          return
        }

        if(!param.lxdh){
          Toast.fail('请输入联系电话')
          return
        }

        if(!param.position){
          Toast.fail('请选择招聘岗位')
          return
        }

        if(!param.zgxz){
          Toast.fail('请选择最高薪资')
          return
        }

        if(!param.zdxz){
          Toast.fail('请选择最低薪资')
          return
        }


        saveZpinfo(param).then(response => {
          if (response.code === 200) {
            //Toast.success('保存成功')
            this.$router.push({ path: '/zpSuccess', query: {}})
          }else{
            Toast.fail(response.msg)
          }
        })

      },

      saveReportReadNum(){
        let param = {}
        param.dictType = 'report_readed'
        saveReportReadNum(param).then(response => {
          if (response.code === 200) {

          }else{
            // Toast.fail(response.msg)
          }
        })
      },


      /**
       * 删除附件
       * @param {*} e
       */
      delImgs:function(item){
        console.log(item)
        console.log(this.images)
        let that = this
        let images = that.images
        let length = images.length
        for(var i=0;i<length;i++){
          if(images[i] == item.item){
            that.images.splice(i,1)
          }
        }
      },

      selectTp(){
        window.postMessage('camera');
        document.getElementById("uploadfileid").click();
      },

      fileSelected() {
        var file = document.getElementById('uploadfileid').files[0];
        if (file) {
          var fileSize = 0;
          if (file.size > 1024 * 1024)
            fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
          else
            fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';

          console.log(file.name)
          console.log(fileSize)
          console.log(file.type)

          let formData = new FormData();
          formData.append("file", file);
          formData.append("type","quanzi")
          let fileList = []
          uploadShareImg(formData).then(response => {
            console.log(response)
            if(response.code == 200 ){
              fileList.push(response.data.url)
              this.images.push(response.data.url+'')
              this.fileList.concat(fileList)
              console.log(this.fileList)
              console.log(this.images)
            }
          });

        }
      }


    }

  }
</script>

<style scoped>

  .container{
    background-color: white;
    height: auto;
  }

  .columnr{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .rownr{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    font-size: 16px;
  }

  .content{
    font-size: 16px;
    padding:10px;
    width: 80%;
  }

  .text{
    text-indent: 32px;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 16px;
    padding-top: 10px;
    line-height: 200%;
  }

  .text1{
    padding-left: 10px;
    padding-right: 10px;
    font-size: 14px;
    padding-top: 15px;
    line-height: 200%;
  }

  .box {
    position: relative;
    display: inline-block;
    padding-left: 12px;
  }
  .box .clear {
    position: absolute;
    top: 0;
    right: 0;
  }


</style>
